{% extends "admin/change_form.html" %}
{% load staticfiles %}
{% block extrahead %}{{ block.super }}
    {% include 'services/admin_head.html' %}
    <script src="{% static 'admin/js/popup_fix.js' %}" type="text/javascript"></script>
    <script src="{% static 'admin/js/agreement_filter.js' %}" type="text/javascript"></script>
    <script type="text/javascript">
        const _CLIENT_ = "{{ client_id  }}";
        (function ($) {
            $(document).ready(function () {
                agreementFilter({client: _CLIENT_, url: "{% url 'admin:get_client_agreements' 0 %}"});
                $("#id_connection_type").change(function () {
                    clearParameters();
                    var id = $(this).val();
                    if (id) {
                        $.ajax({
                            method: "POST",
                            url: '{% url "admin:get_connection_type_parameters" 0 %}'.replace("/0/", "/" + id + "/"),
                            data: {csrfmiddlewaretoken: $.cookie('csrftoken')},
                            async: false
                        }).done(bindParameterInlines);
                    }
                });

                createParamLabels();
            });


            function createParamLabels() {
                $("#serviceparametervalue_set-group div.grp-module.grp-tbody").not(".grp-empty-form").each(function () {
                    if ($(".grp-td.parameter div.grp-readonly", this).length == 0) {
                        var name = $(".grp-td.parameter select option:selected", this).text();
                        $(".grp-td.parameter", this).append($("<div class='grp-readonly'></div>").html(name));
                    }
                });
            }

            function bindParameterInlines(params) {
                var rowsContainer = $("#serviceparametervalue_set-group div.grp-module.grp-table");
                for (var i = 0; i < params.length; i++) {
                    $("#serviceparametervalue_set-group .grp-add-handler").first().click();
                    var newRow = $("div.grp-dynamic-form", rowsContainer).last().find('.grp-tr');
                    $(".grp-td.parameter select", newRow).val(params[i].id);
                }
                createParamLabels();
            }

            function clearParameters() {
                var rowsContainer = $("#serviceparametervalue_set-group div.grp-module.grp-table");
                $("div.grp-dynamic-form", rowsContainer).each(function () {
                    if (!$(this).is(".grp-predelete"))
                        $(".grp-delete-handler, .grp-remove-handler", this).click();
                });
            }
        })(grp.jQuery);
    </script>
    <style type="text/css">
        .grp-icon.grp-remove-handler, .grp-icon.grp-delete-handler {
            display: none;
        }

        .grp-td.parameter select, .grp-td.parameter a {
            display: none;
        }

        #serviceparametervalue_set-group .grp-predelete {
            display: none;
        }
    </style>

{% endblock %}
